Проблема с таблицей

[moskalev_mihail]

Вот код таблицы: http://jsfiddle.net/T466t/

Проблема в белых отступах в ячейках. Под этот случай не подходит ни border-left, т.к. он перекрывет синие полосы в начале и в конце таблицы, ни border-spacin, т.к. не работает в IE нормально(+ тоже перекрывает полосы). На первых порах сделал div'ми с белым фоном и задал им высоту ячейки, но если в ячейке появляется вторая строка с текстом вся верстка едет

Мне на ум пришло только два варианта:

1. Обернуть таблицу div и ему сделать синие бордеры, которые будут накладываться на таблицу. Но тогда придется делать две таблицы: 1я с шапкой, 2я с дивом и контентом таблицы.

2. Написать маааленький скрипт на JS, что бы высчитывалась высота div'а с белым фоном относительно высоты ячейки.

Оба способа мне кажутся не очень правильными, может быть вы можете предложить более изящный вариант? А если другого решения нет, то какой из моих вариантов лучше использовать?

Заранее благодарю)

[hedgehog]

А как насчет одного этих вариантов?

http://htmlbook.ru/css/background (внимание на background-position)

http://htmlbook.ru/css/border-collapse

Edited December 22, 2011 by hedgehog

[moskalev_mihail]

А как насчет одного этих вариантов?

http://htmlbook.ru/css/background (внимание на background-position)

http://htmlbook.ru/css/border-collapse

Можно подробнее как это приминимо в подобном случае? background и так стоит у ячеек , каждая вторая ячейка должна быть выделена синим, а border-collaps не применим, потому что разрывает синие линии в начале и в конце таблицы.

[hedgehog]

Можно подробнее как это приминимо в подобном случае? background и так стоит у ячеек , каждая вторая ячейка должна быть выделена синим, а border-collaps не применим, потому что разрывает синие линии в начале и в конце таблицы.

По ссылке написано Берем, например, белую png'шку шириной 6px и высотой 1px. И получается что-то вроде этого:

td {background: url('bg.png') repeat-y 100% 0;}
td:last-child {background: none;}

Или наоборот

td {background: url('bg.png') repeat-y;}
td:first-child {background: none;}

Edited December 22, 2011 by hedgehog

[moskalev_mihail]

Можно подробнее как это приминимо в подобном случае? background и так стоит у ячеек , каждая вторая ячейка должна быть выделена синим, а border-collaps не применим, потому что разрывает синие линии в начале и в конце таблицы.

По ссылке написано Берем, например, белую png'шку шириной 6px и высотой 1px. И получается что-то вроде этого:

td {background: url('bg.png') repeat-y 100% 0;}
td:last-child {background: none;}

Или наоборот

td {background: url('bg.png') repeat-y;}
td:first-child {background: none;}

видимо я не понятно объяснил... Точнее ошибся, не каждая вторая ячейка, а каждая вторая строка. Ваш вариант в данном случае не совсем подходит. Видимо без костылей тут не обойтись и буду делать через JS. Думаю 2 строчки кода не попортят верстку)

Все равно спасибо за совет)

[hedgehog]

видимо я не понятно объяснил... Точнее ошибся, не каждая вторая ячейка, а каждая вторая строка. Ваш вариант в данном случае не совсем подходит. Видимо без костылей тут не обойтись и буду делать через JS. Думаю 2 строчки кода не попортят верстку)

Все равно спасибо за совет)

Ммм, речь идет об этом "отступе"? http://i.imgur.com/EQUcK.png

В моем примере бекграунд (отступ) будет у каждой ячейки, кроме последней (или первой). На белом фоне белый бекграунд не виден. Если нужно задавать только для конкретных ячеек - на них можно вешать класс. Если не пугают лишние блоки на странице - можно и дивную обертку сделать, и отступы делать дополнительными ячейками с бекграундом white/transparent

Edited December 22, 2011 by hedgehog

[moskalev_mihail]

видимо я не понятно объяснил... Точнее ошибся, не каждая вторая ячейка, а каждая вторая строка. Ваш вариант в данном случае не совсем подходит. Видимо без костылей тут не обойтись и буду делать через JS. Думаю 2 строчки кода не попортят верстку)

Все равно спасибо за совет)

Ммм, речь идет об этом "отступе"? http://i.imgur.com/EQUcK.png

В моем примере бекграунд (отступ) будет у каждой ячейки, кроме последней (или первой). На белом фоне белый бекграунд не виден. Если нужно задавать только для конкретных ячеек - на них можно вешать класс. Если не пугают лишние блоки на странице - можно и дивную обертку сделать, и отступы делать дополнительными ячейками с бекграундом white/transparent

точно! Сразу просто не понял совета) Спасибо!